<template>
  <div class="inviteContainer">
        <!-- 全选，反选 -->
        <div class="topChose">
            <div  @click="$router.back()">
             <yd-icon name="back" slot="icon" custom  size=".3rem" color="#FFffff"></yd-icon>
             详细资料
            </div>
            <div @click="invite">完成</div>
        </div>
        <div style="height:1rem;width:100%">

        </div>
        <yd-checklist v-model="checklist" ref="mycheck">
            <yd-checklist-item :val="item.friendID||item.attentionUserID" v-for="(item,n) in list" :key="n">
                <div class="userDetail">
                    <div class="left">
                        <img :src="item.user.photo" >
                    </div>
                    <div>
                        <p style="line-height:1rem" v-if="item.remark==''">{{item.user.name}}</p>
                        <p style="line-height:1rem" v-if="item.remark!=''">{{item.remark}}</p>
                    </div>
                </div>
            </yd-checklist-item>
        </yd-checklist>
  </div>
</template>
<script>
export default {
  data(){
      return {
        checklist: [],
        isCheckAll: false,
        list:[]
      }
  },
  computed:{
      status(){
          return this.$store.state.invitaObj
      }
  },
  methods:{
    // change(value, isCheckAll) {
    //     // this.isCheckAll = isCheckAll;
    // },
    checkAll() {
        this.isCheckAll = !this.isCheckAll;
        this.$refs.mycheck.$emit('ydui.checklist.checkall', this.isCheckAll);
        console.log(this.checklist)
    },
    friendList(){//查看好友列表
        let data={
            userId:localStorage.userid
        }
        this.ylAjax.friendList(data)
            .then(res=>{
            if(res.state==0){
                this.list=res.data
                console.log(this.list)
                }
        })
            .catch(error=>{
                throw error
        })
    },
    caninviteList(){//查看可以添加用户
        let data={
            userId:localStorage.userid,
            groupID:this.status.groupId
        }
        this.ylAjax.canjoin(data)
            .then(res=>{
                // console.log(res)
                if(res.state==0){
                    this.list=res.data
                }
                
            })
    },
    canJoinFocusList(){//查看可以添加进关注分组用户
        let data={
            userId:localStorage.userid,
            groupID:this.status.groupId
        }
        this.ylAjax.canjoinFocus(data)
            .then(res=>{
                // console.log(res)
                if(res.state==0){
                    this.list=res.data
                }
            })
    },
    focusList(){//查看关注列表
        let data={
            userId:localStorage.userid
        }
        this.ylAjax.showMyFocus(data)
            .then(res=>{
                console.log(res.data)
                if(res.state==0){
                    this.list=res.data
                }
            })
            .catch(error=>{
                throw error
            })        
    },
    addFriendList(){//添加进好友列表
         let data={
             groupID:this.status.groupId,
             userIds:this.checklist.toString()
         }
         this.ylAjax.Invitation(data)
                    .then(res=>{
                        if(res.state==0){
                        console.log(res)
                        this.$router.push({path:'/friend'})    
                        }else{
                            this.$dialog.toast({mes: res.message, timeout: 1000});
                        }
                    })
                    .catch(error=>{
                        throw error
                    })
    },
    addFocusList(){//添加关注列表
        let data={
             groupID:this.status.groupId,
             userIds:this.checklist.toString()            
        }
        this.ylAjax.addToFocusList(data)
                   .then(res=>{
                       console.log(res)
                        if(res.state==0){
                        console.log(res)
                        this.$router.push({path:'/focus'})    
                        }else{
                            this.$dialog.toast({mes: res.message, timeout: 1000});
                        }
                   })
                   .catch(error=>{
                       throw error
                   })
    },
    invite(){//完成
        if(this.status.methods=="friend"){
            this.addFriendList()
        }else if(this.status.methods=="focus"){
            this.addFocusList() 
        }
    }
  },
  mounted(){
      if(this.status.type=="all"&&this.status.methods=="friend"){
          this.friendList()//查询所有人
      }else if(this.status.type=="some"&&this.status.methods=="friend"){
          this.caninviteList()//查询分组外的人
      }else if(this.status.type=="all"&&this.status.methods=="focus"){
          this.focusList()//查询所有关注人
      }else if(this.status.type=="some"&&this.status.methods=="focus"){
          this.canJoinFocusList()//查询分组外的人
      }
      
  }
}
</script>
<style lang="less" scoped>
    @import "~less/base";
    .inviteContainer{
        .topChose{
            display: flex;
            padding: .3rem;
            padding-left: .25rem;
            position: fixed;
            top: 0rem;
            width: 100%;
            font-size: 14px;
            background-color: @background-a;
            color: @color-c;    
            >:nth-child(1){
                flex: 0 0 80%;
            }
            >:nth-child(2){
                flex: 0 0 20%;
                text-align: center
            }
        }
        .userDetail{//用户列表
            display: flex;
            height: 1.3rem;
            .left{
                flex: 0 0 20%;
                line-height: 1.3rem;
                img{
                    width: 1rem;
                    border-radius: 50%;
                    vertical-align: middle;
                }
            }     
        }
    }
</style>
